<!DOCTYPE html>
<html>
<head>
    <title>NudistFriends</title>
    <meta http-equiv=Content-Type content="text/html" charset='utf-8'>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="telephone=no" name="format-detection">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="keywords" content="nudist, naked, nudist man, nudist woman, nude, naked man, naked woman, mature man, mature woman">
    <meta name="description" content="World's best and largest dating site for nudists, naturists and best place to enjoy a natural, nude,naked, clothing free lifestyle. Nudist photo, nude beach, nudist camp, nudist colony, nude celebrity.">
    <meta name="classification" content="Nudist, Naturist, Nudist dating, Nudist online dating, Nudist personals, Nudist singles, Nudist matchmaking">
    <script>
		var  winW,PX,remoteResource,dom,index,engine = 'nff',mainSite,domain;
             currentmain = 'http://m.nudistfriends.com/';
        // For development
        if (location.href.indexOf("?dev") > 0) {
            mainSite = 'http://www.nudistfriends.com/',
            domain = 'http://www.nff.com/?dev',
            remoteResource = 'http://static.nff.com/';
        }  else {
            mainSite = 'http://www.nudistfriends.com/',
            domain = 'http://mobile.nudistfriends.com/',
            remoteResource = 'http://static.nudistfriends.com/';
        }

        loadJS(remoteResource+"sea-modules/zepto/zepto.min.js",swipe);
        
        function swipe() {
            loadJS(remoteResource+"sea-modules/swipe/zepto.swipe.js",init);
        }
        
        function loadJS(js,callback) {
            var fileref = document.createElement('script');
                fileref.setAttribute("type","text/javascript");
                fileref.setAttribute("src",js);
                fileref.addEventListener("onreadystatechange",function(e){console.log(e)});
                fileref.onreadystatechange = fileref.onload = function() {
                    if (!this.readyState || this.readyState=='loaded' || this.readyState=='complete') {
                        fileref = null;
                        callback();
                    }
                 };
            document.getElementsByTagName("head")[0].appendChild(fileref); 
        }       

        function init() {
            $(window).bind('orientationchange',function(){
                 winW = $('.slider').width();
                 $('.slider').find('img').css({'width':winW+'px'});      
                 PX = winW * index;
                 dom.css({
                    '-webkit-transform' : 'translate(-'+PX+'px)', 
                    '-moz-transform' : 'translate(-'+PX+'px)', 
                 });                  
            });

            $(document).ready(function(){
                winW = $('.slider').width();  
                $('.slider').find('img').css({'width':winW+'px'});          
                $('body').find('.slider').swipe({
                     swipeLeft : function(e){
                         dom = $(e.target).closest('ul'),
                         index = $(e.target).closest('li').index() + 1,
                         index = index > 2 ? 2 : index,
                         PX = winW * index;
                         move(dom,PX,index);
                     },
                     swipeRight : function(e){
                         dom = $(e.target).closest('ul'),
                         index = $(e.target).closest('li').index()-1,
                         index = index < 0 ? 0 :index,
                         PX = winW * index;
                         move(dom,PX,index);
                      } 
                });
     
                function move(dom,PX,index) {
                     $(dom).css({               
                        '-webkit-transform' : 'translate(-'+PX+'px)', 
                        '-webkit-transition' : '200ms linear',
                        '-moz-transform' : 'translate(-'+PX+'px)', 
                        '-moz-transition' : '200ms linear'
                     }); 
                     $('.tabnumbox').find('span').removeClass('current').eq(index).addClass('current');
                }

                $('.btn-mobile-beta').on('tap',function(){
                    window.location.href = domain; 
                });

                $('.btn-mobile-current').on('tap',function(){
                    window.location.href = currentmain; 
                });

                $('.box-view-full').on('tap',function(){
                    window.location.href = mainSite+'?main=1'; 
                });

             });
        }
       	</script>
    <link rel="stylesheet" href="./resource/nff/css/guide.css">
</head>
<body>
	<div class="baner-guide">
        <div class='slider'>
           <ul>
    	     <li><img src="./resource/nff/img/baner_01.png"></li>
    	     <li><img src="./resource/nff/img/baner_02.png"></li>
    	     <li><img src="./resource/nff/img/baner_03.png"></li>
           </ul>
        </div>
        <div class="tabnumbox">
        	<span class='current'></span>
            <span></span>
            <span></span>
        </div>
    </div>
    <a class="btn-mobile-beta">
    	<span>Mobile Version <font>Beta</font></span>
    </a>
    <a class="btn-mobile-current">
        Current Mobile Version
    </a>
    <div class="box-view-full">
    	<a href="#">View Full Site</a>
    </div>
</body>
</html>

